// fenlei
.fenlei{
    display: flex;
    justify-content: space-around;
    margin:2em 2em;
    .left{
        ul{
            li{
                a{
                    white-space: nowrap;
                    margin:1em auto;
                    color:black;
                    font-weight: bold;
                }
                a:hover{
                    color:red;
                }
            }
        }
    }
    .right{
        .top{
            position: relative;
            img{
                position: absolute;
                left:2em;
                width: 242px;
                height:90px;
            }
        }
        .content{
            height:28em;
            overflow-y: scroll;
            margin:7em auto;
            margin-bottom: 0;
            .hot{
                
                p{
                    font-weight: bold;
                    margin:1em 1.5em;

                }
            }
            .bottom1{
                display: flex;
                justify-content: space-around;
                flex-wrap: wrap;
                .item{
                    width:26%;
                    padding:0em 1em;
                    margin:.5em auto;
                    span{
                        text-align: center;
                    }
                }
            }
    
            .bottom2{
                display: flex;
                justify-content: space-around;
                flex-wrap: wrap;
                .item{
                    width:26%;
                    padding:0em 1em;
                    margin:.5em auto;
                    span{
                        text-align: center;
                    }
                }
            }
            .bottom3{
                display: flex;
                justify-content: space-around;
                flex-wrap: wrap;
                .item{
                    width:26%;
                    padding:0em 1em;
                    margin:.5em auto;
                    span{
                        text-align: center;
                    }
                }
            }
            .bottom4{
                display: flex;
                justify-content: space-around;
                flex-wrap: wrap;
                .item{
                    width:26%;
                    padding:0em 1em;
                    margin:.5em auto;
                    span{
                        text-align: center;
                    }
                }
            }
            .bottom5{
                display: flex;
                justify-content: space-around;
                flex-wrap: wrap;
                .item{
                    width:26%;
                    padding:0em 1em;
                    margin:.5em auto;
                    span{
                        text-align: center;
                    }
                }
            }
        }
        
        
    }

    @media screen and (max-width:320px){
        &{
            .right{
                .top{
                    img{
                        width:170px;
                        height:80px;
                    }
                }
                .content{
                    .bottom1{
                        display: flex;
                        justify-content: space-around;
                        flex-wrap: wrap;
                        .item{
                            width:50%;
                            text-align: center;
                            img{
                                width:50px;
                                height:50px;
                            }
                            span{
                                white-space: nowrap;
                                
                            }
                        }
                    }

                    .bottom2{
                        display: flex;
                        justify-content: space-around;
                        flex-wrap: wrap;
                        .item{
                            width:50%;
                            text-align: center;
                            img{
                                width:50px;
                                height:50px;
                            }
                            span{
                                white-space: nowrap;
                                
                            }
                        }
                    }
                    .bottom3{
                        display: flex;
                        justify-content: space-around;
                        flex-wrap: wrap;
                        .item{
                            width:50%;
                            text-align: center;
                            img{
                                width:50px;
                                height:50px;
                            }
                            span{
                                white-space: nowrap;
                                
                            }
                        }
                    }
                    .bottom4{
                        display: flex;
                        justify-content: space-around;
                        flex-wrap: wrap;
                        .item{
                            width:50%;
                            text-align: center;
                            img{
                                width:50px;
                                height:50px;
                            }
                            span{
                                white-space: nowrap;
                                
                            }
                        }
                    }
                    .bottom5{
                        display: flex;
                        justify-content: space-around;
                        flex-wrap: wrap;
                        .item{
                            width:50%;
                            text-align: center;
                            img{
                                width:50px;
                                height:50px;
                            }
                            span{
                                white-space: nowrap;
                                
                            }
                        }
                    }
                }
            }
        }
    }
}

// footer
.footer{
    background-color: white;
    margin:3em auto;
    .box1{
        display: flex;
        justify-content: space-around;
        margin:1em auto;
        
        

        .item1{
            width:12%;
            text-align: center;
            margin:1.5em auto;
            margin-bottom: 0;
            
            img{
                width:78%;
                height:55%;
            }
          
            a{
                color:black;
                font-size:10px;
                font-weight: bold;
                left:22px;
            }
        }
    }

   
}